<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>主页</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<script src="html5plus://ready"></script>
		<link rel="stylesheet" type="text/css" href="../../css/home.css"/>
		<link rel="stylesheet" href="../../css/main.css" />
		<link rel="stylesheet" href="../../css/index.css" />
		<script src="../../libs/js/vue.min.js"></script>
		<script src="../../libs/js/vant.min.js"></script>
	
		
	</head>

	<body>
		<div id="app">
			<div id="header">
				<van-search id="search" placeholder="搜索商品名称" v-model="value"></van-search>
			</div>
			<van-swipe :autoplay="2000" indicator-color="white":height="222">
			  <van-swipe-item><img src="../../img/images/6e86b41f77f14f1b950dcff2c852b7b0.jpeg" width="100%" height="100%"/></van-swipe-item>
			  <van-swipe-item><img src="../../img/images/1614519.png" width="100%" height="100%"/></van-swipe-item>
			  <van-swipe-item><img src="../../img/images/ChMlWlyi1feIbs7tAABq9qpuHt0AAJK-wMNaKQAAGsO891.jpg" width="100%" height="100%"/></van-swipe-item>
			  <van-swipe-item><img src="../../img/images/20190213051144669.jpg"width="100%" height="100%"/></van-swipe-item>
			</van-swipe>
			<van-row class="margin" >
				<van-col span="6">
					<van-goods-action-mini-btn>
						<van-icon><img style="height: 40px !important;width: 40px !important;" src="../../img/images/78_78_1551094060326.jpg"/></van-icon>
						<p style="margin-top: 6px;">华为nova4</p>
					</van-goods-action-mini-btn>
				</van-col>
				<van-col span="6">
					<van-goods-action-mini-btn>
						<van-icon><img style="height: 40px !important;width: 40px !important;" src="../../img/images/78_78_1553080165483.jpg"/></van-icon>
						<p style="margin-top: 6px;">华为p30pro</p>
					</van-goods-action-mini-btn>
				</van-col>
				<van-col span="6"><van-goods-action-mini-btn>
						<van-icon><img style="height: 40px !important;width: 40px !important;" src="../../img/images/78_78_1544693648195.jpg"/></van-icon>
						<p style="margin-top: 6px;">小米9</p>
					</van-goods-action-mini-btn></van-col>
				<van-col span="6"><van-goods-action-mini-btn>
						<van-icon><img style="height: 40px !important;width: 40px !important;" src="../../img/images/15504710198747564_100X100.jpg"/></van-icon>
						<p style="margin-top: 6px;">三星s10</p>
					</van-goods-action-mini-btn></van-col>
			</van-row>
			
			
			
			
            <div id="zixun">
					<van-row>
						<van-col span="4" style="text-align: center;line-height: 40px;color: red;font-size: 12px;">
							<a style="color: red;"href="javascript:;">资讯</a>
							<span style="border: 0.5px solid black;margin-left: 10px;"></span>
						</van-col>						
						<van-col span="16">
							<van-notice-bar	text="华为 HUAWEI nova 4 4800万超广角三摄 ！小米9王源限量版手机！"
							 left-icon="volume-o"></van-notice-bar>
						</van-col>	
						<van-col span="4" style="text-align: center;line-height: 40px;color: rgba(0,0,0,0.5);font-size: 12px;">
							<span style="border: 0.5px solid black;margin-right: 10px;"></span>
							<a style="color: red;"href="javascript:;">更多</a>
							</van-col>						
					</van-row>	
			</div>			
            
            
            <van-collapse v-model="activeNames">
			  <van-collapse-item name="1">
			    <div slot="title" style="font-weight: 1000"><span id="" style="color: red;">|</span>热门推荐</div>
			        <van-row>
					  <van-col span="16"><img src="../../img/images/6e86b41f77f14f1b950dcff2c852b7b0.jpeg" height="100%" width="100%"/></van-col>
		            </van-row>
		            <div id="" style="font-weight: 500; color: #000000;">HUAWEI nova 4</div>
		           
		            <van-row>
					  <van-col span="16"><img src="../../img/images/ChMlWlyi1feIbs7tAABq9qpuHt0AAJK-wMNaKQAAGsO891.jpg" height="100%" width="100%"/></van-col>
		            </van-row>
		            <div id="" style="font-weight: 500;color: #000000;">小米9 王源限量版</div>
		           
			  </van-collapse-item>
			  <van-collapse-item
			    title="商品列表"
			    name="2"
			    icon="shop-o"
			  >
			        <van-card
			  
			  
			  price="3399.00"
			  desc="全网通"  
			  title="HUAWEI nova 4 "
			  :thumb="imageURL"
			  origin-price="3599.00"
			>
			  <div slot="footer">
			    <van-button size="mini">加购物车</van-button>
			    <van-button size="mini">立即购买</van-button>
			  </div>
			</van-card>
			<van-card
			  
			  
			   price="3599.00"
			  desc="全网通"  
			  title="小米9 王源限量版"
			  :thumb="imageURL1"
			  origin-price="3699.00"
			>
			 <div slot="footer">
			    <van-button size="mini">加购物车</van-button>
			    <van-button size="mini">立即购买</van-button>
			  </div> 
			</van-card>
			<van-card
			  
			  
			  price="3399.00"
			  desc="全网通"  
			  title="HUAWEI nova 4 "
			  :thumb="imageURL2"
			  origin-price="3599.00"
			>
			 <div slot="footer">
			    <van-button size="mini">加购物车</van-button>
			    <van-button size="mini">立即购买</van-button>
			  </div>
			</van-card>
			<van-card
			  
			  
			   price="3399.00"
			  desc="全网通"  
			  title="HUAWEI nova 4 "
			  :thumb="imageURL3"
			  origin-price="3599.00"
			>
			 <div slot="footer">
			    <van-button size="mini">加购物车</van-button>
			    <van-button size="mini">立即购买</van-button>
			  </div>
			</van-card>
			  </van-collapse-item>
			</van-collapse>
            
            
            
		    
			
		</div>
		<script type="text/javascript">
			var app = new Vue({
				el: "#app",
				data: {
					value: "",
					active: 0,
					activeNames: ['2'],
					views: [{
							name: "home",
							url: "views/home.html"
						},
						{
							name: "assortment",
							url: "views/assortment.html"
						}, {
							name: "cart",
							url: "views/cart.html"
						}, {
							name: "personal",
							url: "views/personal.html"
						}
					],
					imageURL:"../../img/images/78_78_1551094056841mp.png",
					imageURL1:"../../img/images/pms_1553861250.52889437.jpg",
					imageURL2:"../../img/images/ChMkJ1wnLhOIDlxqAACnY5c6qOcAAuEHgLrddIAAKd7126.jpg",
					imageURL3:"../../img/images/78_78_1544693705421mp.png",
				},
				created: function() {
					var _this = this;
					var self = plus.webview.currentWebview();
					for(var i = 0; i < _this.views.length; i++) {
						var tempWebview = plus.webview.create(_this.views[i].url, _this.views[i].name, {
							top: "46px",
							bottom: "50px",
							zindex: 1
						})
						self.append(tempWebview);
					}
					plus.webview.show(_this.views[_this.active].name);
				},
				methods: {
					tabchange: function() {
						plus.webview.show(this.views[this.active].name);
					}
				}
			})
		</script>
		
	</body>

</html>